PrimeVue 為一個基於 Vue 開發的 UI 元件庫，包含多樣豐富的 UI 元件，期望在開發上能達到高度複用，並且給予彈性提供開發者客製的空間；並提供主題套用及 Pass Through 這類較特殊的 API，相關說明待後續篇幅討論。

恰逢今年工作轉換，新團隊使用 PrimeVue 作為 Vue UI component 套件進行開發，由於之前有使用過 Vuetify，與 PrimeVue 的使用性高度相似，在 PrimeVue 的學習上能夠更深入地掌握。

另外參賽的原因還有，由於初學 PrimeVue 時還是第三版，沒想到在 7 月第四版發布正式版了，再加上遷移說明上特別註明

PrimeVue v3 will continue to be maintained until the end of 2024.

第三版僅維護到今年底，因此在工作上的專案決定進行版本的升級，也趁這個更版的機會記錄下整個搬移的過程。

根據遷移說明了解第四版有大幅度針對 CSS 主題載入架構進行調整。

原第三版採用 PrimeFlex 作為 CSS 通用類別庫的樣式使用，而在第四版官方文件說明：

Moving from PrimeFlex to Tailwind CSS.

因此需要另外進行與 tailwindCSS 的整合。

本次參賽主要會針對第四版進行說明，大綱主要包含：

• 安裝及相關主題套件設定
• 主題說明
• 整合 tailwindCSS
• PrimeVue options 的相關設定
• 升級第四版的搬遷說明

說明完以上 5 點應該還有篇幅，再討論實務上的應用或元件的 API 內容。

希望能完成本次賽程~

參考連結：

1. https://PrimeVue.org/guides/migration/v4/
2. https://PrimeVue.org/guides/primeflex/